<template>
	<view class="l_pages">
		<jnavbar title="添加抬头"></jnavbar>
		<scroll-view class="page_container tab_page_container" scroll-y>
			<view class="page">
				<view class="page_title">
					如要开具增值税专用发票，需全部填写
				</view>
				<view class="content bgf">
					<u-form :model="form" ref="uForm">
						<u-form-item label-width="0">
							<u-radio-group v-model="form.invoice_type" active-color="orange">
								<u-radio :name="2">企业</u-radio>
								<u-radio :name="1">个人及政府事业单位</u-radio>
							</u-radio-group>
						</u-form-item>
						<u-form-item label="名称" label-width="140" prop="rise" :required="true">
							<u-input v-model="form.rise" placeholder="输入关键词支持模糊匹配" />
						</u-form-item>
						<u-form-item label="税号" label-width="140" :prop="form.invoice_type==2?'duty_paragraph':''" :required="form.invoice_type==2">
							<u-input v-model="form.duty_paragraph" placeholder="输入纳税人识别号（必填）" />
						</u-form-item>
						<u-form-item label="默认抬头" label-width="140">
							<u-switch v-model="checked" size="36" active-color="#FBBA14" inactive-color="#eee">
							</u-switch>
						</u-form-item>
						<u-form-item label="公司地址" label-width="140" prop="address" :required="true">
							<u-input v-model="form.address" placeholder="输入公司地址" />
						</u-form-item>
						<u-form-item label="开户银行" label-width="140">
							<u-input v-model="form.deposit_bank" placeholder="输入公司开户银行" />
						</u-form-item>
						<u-form-item label="银行账号" label-width="140">
							<u-input v-model="form.bank_account" placeholder="输入公司银行账号" />
						</u-form-item>
						<view class="page_title" style="background:#f4f4f4;">
							填写联系方式，向你同步电子发票信息
						</view>
						<u-form-item label="手机号" label-width="140" prop="phone" :required="true">
							<u-input v-model="form.phone" placeholder="输入个人手机号码（必填）" />
						</u-form-item>
						<u-form-item label="邮箱" label-width="140" prop="mailbox" :required="true">
							<u-input v-model="form.mailbox" placeholder="输入个人邮箱（必填）" />
						</u-form-item>
					</u-form>
				</view>
			</view>
		</scroll-view>
		<view class="footer">
			<view class="footer-text" @click="postForm()">保存</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import {
		getisInvoice
	} from '@/common/invoice.js'
	import http from '@/common/http.js';
	export default {
		data() {
			return {
				form: {
					invoice_type: 2,
					rise: '',
					duty_paragraph: '',
					is_default: 0,
					address: '',
					deposit_bank: '',
					bank_account: '',
					phone: '',
					mailbox: ''
				},
				checked: false,
				rules: {
					rise: [{
						required: true,
						message: '请输入企业名称',
						trigger: 'blur'
					}],
					duty_paragraph: [{
						required: true,
						message: '请输入税号',
						trigger: 'blur'
					}],
					phone: [{
							required: true,
							message: '请输入手机号码',
							trigger: 'blur'
						},
						{
							pattern: /^1[3456789]\d{9}$/,
							message: "手机号码格式不正确",
							trigger: "blur"
						}
					],
					mailbox: [{
							required: true,
							message: '请输入邮箱',
							trigger: 'blur'
						},
						{
							pattern: /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,
							message: "邮箱格式不正确",
							trigger: "blur"
						}
					],
					address: [{
						required: true,
						message: '请输入公司地址',
						trigger: 'blur'
					}],
				}
			}
		},
		async onLoad(e) {
			await this.$getWx
			this.getjuris('tradeSetting').then(a => {
				this.tradeSetting = a
			})
			this.oid = e.id
			this.getInvoice()
		},
		methods: {
			postForm() {
				let data = this.form
				if (this.checked == true) {
					data.is_default = 1;
				} else {
					data.is_default = 0;
				}
				// 验证表单
				this.$refs.uForm.validate(valid => {
					if (valid) {
						if (this.oid) {
							http('/invoice/riseUp', data, 'put').then(res => {
								this.setTimer("修改成功", 1500)
							})
						} else {
							http('/invoice/riseCreate', data, 'POST').then(res => {
								this.setTimer("提交成功", 1500)
							})
						}

					}
				})
			},
			setTimer(title, time) {
				uni.showToast({
					title,
					icon: "none"
				})
				let timea = setTimeout(function() {
					clearTimeout(timea)
					let pages = getCurrentPages() //页面栈
					let beforePage = pages[pages.length - 2] //上一页
					uni.navigateBack({
						delta: 1,
						success: function() {
							beforePage.$vm.index(); // 执行前一个页面的刷新
						}
					});
				}, time)
			},
			getInvoice() {
				let data = {
					id: this.oid
				}
				if (data.id) {
					http('/invoice/riseGain/', data, 'get').then(res => {
						this.form = res.data.msg
						if (this.form.is_default == 1) {
							this.checked = true
						} else {
							this.checked = false
						}
					})
				}
			},
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		// 提交保存抬头

	}
</script>

<style lang="scss" scoped>
	.page {
		background-color: #f6f7f8;

		.page_title {
			padding: 20rpx 30rpx;
			font-size: 24rpx;
			color: #898989;
		}
	}

	.content {
		border-radius: 20rpx;
		font-size: 28rpx;
		overflow: hidden;
		padding: 0 30rpx;
		.u-form-item {
			// padding: 20rpx 30rpx;
		}
	}

	.bgf {
		background-color: #fff;
	}

	.footer {
		width: 95%;
		line-height: 80rpx;
		text-align: center;
		background: radial-gradient(circle farthest-side at top left, #FE8E0A 0, #FF5011 100%);
		border-radius: 50rpx;
		margin: auto;
		font-size: 28rpx;
		margin-bottom: 20rpx;

		.footer-text {
			font-size: 28rpx;
			color: #fff;
		}
	}
</style>
